        <!-- nav区域 -->
        <nav>
            <div>
                <div class="logo"><img src="./img/logo.png" alt=""></div>
                <ul>
                    <li class="navli"><a href="./html/list.html">华为专区</a></li>
                    <li class="navli2"><a href="#">鸿蒙智联</a></li>
                    <li class="navli3"><a href="#">全球甄选</a></li>
                    <li class="navli4"><a href="#">家电家装馆</a></li>
                    <li class="navli5"><a href="#">华为智选</a></li>
                    <li class="navli6"><a href="#">HarmonyOS</a></li>
                </ul>
                <div class="search">
                    <div>
                        <span class="iconfont">&#xe618</span>
                        <input type="text" placeholder="搜索商品" id="navinput">
                        <ul id="navul"></ul>
                        <span class="spancha">×</span>
                    </div>
                </div>
            </div>
            <div class="secondUl">
                <ul>
                    <!-- <li>
                        <a href="">
                            <img src="./img/phone6.png" alt="">
                            <p>shouji12</p>
                        </a>
                    </li>
                     -->
                </ul>
            </div>
            <div class="secondUl2">
                <ul></ul>
            </div>
            <div class="secondUl3">
                <ul></ul>
            </div>
            <div class="secondUl4">
                <ul></ul>
            </div>
            <div class="secondUl5">
                <ul></ul>
            </div>
            <div class="secondUl6">
                <ul></ul>
            </div>
        </nav>
        <!-- 轮播区域 -->
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide"><img src="./img/轮播1.jpg.webp" alt="" srcset=""></div>
                <div class="swiper-slide"><img src="./img/轮播2.jpg.webp" alt="" srcset=""></div>
                <div class="swiper-slide"><img src="./img/轮播3.jpg.webp" alt="" srcset=""></div>
                <div class="swiper-slide"><img src="./img/轮播4.png.webp" alt="" srcset=""></div>
                <div class="swiper-slide"><img src="./img/轮播5.png.webp" alt="" srcset=""></div>
                <div class="swiper-slide"><img src="./img/轮播6.jpg.webp" alt="" srcset=""></div>
                <div class="swiper-slide"><img src="./img/轮播7.jpg.webp" alt="" srcset=""></div>
            </div>
            
            <!-- 如果需要分页器 -->
            <div class="swiper-pagination"></div>
            
            <!-- 如果需要导航按钮 -->
            <div class="swiper-button-prev"></div>
            <div class="swiper-button-next"></div>
        </div>
        <!-- 功能区域 -->
        <div class="function">
            <div class="fnmid">
                <div>
                    <img src="./img/1.webp" alt="">
                    <p>企业购</p>
                </div>
                <div>
                    <img src="./img/2.webp" alt="">
                    <p>智能家居</p>
                </div>
                <div>
                    <img src="./img/3.webp" alt="">
                    <p>以旧换新</p>
                </div>
                <div>
                    <img src="./img/4.webp" alt="">
                    <p>教育商店</p>
                </div>
                <div>
                    <img src="./img/5.webp" alt="">
                    <p>新品</p>
                </div>
                <div>
                    <img src="./img/6.webp" alt="">
                    <p>会员频道</p>
                </div>
                <div>
                    <img src="./img/7.webp" alt="">
                    <p>消息中心</p>
                </div>
            </div>
        </div>
        <!-- 新品区域 -->
        <div class="new">
            <div class="mewmid">
                <div><img src="./img/new1.webp" alt=""></div>
                <div><img src="./img/new2.webp" alt=""></div>
                <div><img src="./img/new3.webp" alt=""></div>
                <div><img src="./img/new4.webp" alt=""></div>
            </div>
        </div>
        <!-- 限时购区域 -->
        <div class="setTimeout">
            <div class="timeoutmid">
                <div class="toptime">
                    <div>限时购</div>
                    <div>距结束</div>
                    <div>1：48：30</div>
                </div>
                <div class="bttime">
                    <!-- <div class="bttime1">
                        <div class="bttimetop">
                            <img src="./img/time0.png" alt="">
                        </div>
                        <div class="bttimebt">
                            <p>【订金】HUAWEI MateBook X Pro 2021款</p>
                            <span>预订省1000元</span>
                            <i>¥9999</i>
                        </div>
                    </div> -->
                </div>
                
            </div>
        </div>
        <!-- 爆款区域Popular -->
        <div class="Popular">
            <div class="popmid">
                <div class="toptime">
                    <div>爆款推荐</div>
                </div>
                <div class="bttime">
                    <div class="bttime0">
                        <div>
                            <img src="./img/watch.webp" alt="">
                        </div>
                    </div></div> 
            </div>   
        </div>
        <!-- 小轮播区域 -->
        <div class="rotation1">
            <div>
                <img src="./img/lunbo.webp" alt="">
            </div>
        </div>
        <!-- 手机区域 -->
        <div class="phonewatch">
            <div class="phonewatchmid">
                <div class="toptime">
                    <div>手机</div>
                </div>
                <div class="bttime"></div>
            </div>
        </div>
        <!-- 穿戴区域 -->
        <div class="watchphone">
            <div class="watchphonemid">
                <div class="toptime">
                    <div>智能穿戴&VR</div>
                </div>
                <div class="bttime">   
                </div>
            </div>
        </div>
        <!-- 生态区域 -->
        <div class="ecology">
            <div class="ecologymid">
                <div class="toptime">
                    <div>生态精品</div>
                </div>
                <div class="bttime">
                </div> 
                <button class="more">点击加载更多</button>
            </div>   
        </div>
        

        